<template>
  <el-row style="background: white;height: 20px" :loading="loading">
    <el-col :span="12">
      <div style="float: left;margin-left: 20px;margin-top: 10px;">
        <el-button type="text" @click="actionOperate(action)" v-for="action in actions" :loading="action.actionLoading"  style="color: red;text-decoration: underline;">{{action.actionName}}&nbsp;&nbsp;</el-button>
      </div>
      <submitProcess ref="submitProcess"></submitProcess>
      <AddActor ref="addActor"/>
      <Termination ref="termination"></Termination>
      <TransferActor ref="transferActor"></TransferActor>
      <Reject ref="reject"/>
    </el-col>
    <el-col :span="12">
      <div style="float: right;margin-right: 50px;margin-top: 15px;font-size: 14px">
         <span>当前步骤:&nbsp;{{workflowDetail.details.nodeName}}  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;发起人: &nbsp;{{workflowDetail.details.initUserName}}
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 状态:&nbsp; {{workflowDetail.statusName}}</span>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<el-button type="danger" @click="closeNowWindow" size="mini">关闭</el-button>
      </div>
    </el-col>
  </el-row>
</template>

<script>
import SubmitProcess from '../process/action/SubmitProcess.vue'
import AddActor from '../process/action/AddActor.vue'
import Termination from '../process/action/Termination.vue';
import TransferActor from '../process/action/TransferActor.vue'
import Reject from '../process/action/Reject.vue'
import { utils } from '@/views/process/processEditor/utils/common.js'
import {buildFLow,workflowDetail,submit,reject,getRejectNodeList,termination,nextTask} from '@/api/workflowInstance'
export default {
  components:{
    SubmitProcess,
    AddActor,
    Termination,
    TransferActor,
    Reject
  },
  props:[
    "formData"
  ],
  data() {
    return {
      loading:false,
      taskId:"",
      processId:"",
      processInstanceId:"",
      operateType:"",
      actions:[],
      workflowDetail:{
        statusName:"",
        details:{
          nodeName:"",
          initUserName:"",
          statusName:""
        },
      },
    }
  },
  created() {
    this.initFlow();
  },
  methods: {
    initFlow(){
      this.loading = true;
      this.processId = utils.getUrlParams("processId");
      this.processInstanceId = utils.getUrlParams("processInstanceId");
      this.operateType = utils.getUrlParams("operateType");
      this.taskId = utils.getUrlParams("taskId");
      if(this.operateType === 'build' && (this.processInstanceId == null || this.processInstanceId === "")){
        this.buildFlowOperate();
      }else if(this.processInstanceId != null && this.processInstanceId !== ""){
        this.getWorkflowDetail();
        this.loading = false;
      }
    },
    async getWorkflowDetail(){
      let detailParam = {processInstanceId:this.processInstanceId,processId:this.processId,taskId:this.taskId}
      let detailRet = await workflowDetail(detailParam);
      this.workflowDetail = detailRet.data;
      this.$emit('success',this.workflowDetail)
      if(this.workflowDetail.actions != null){
        this.workflowDetail.actions.forEach(action=>{
          action.actionLoading = false;
        })
      }
      this.actions = this.workflowDetail.actions == null ? []:this.workflowDetail.actions;

    },
    //创建流程
    async buildFlowOperate(){
      let param = {processId:this.processId,formData:{}};
      let ret = await buildFLow(param);
      if(ret.status === '200'){
        this.processInstanceId = ret.data.processInstanceId;
        this.$nextTick(() => {
          this.refreshPage({processInstanceId:this.processInstanceId,processId:this.processId,taskId:ret.data.details.taskId,operateType:"submit"})
          this.loading = false;
        });

      }else{
        this.$message.error('流程创建失败')
      }
    },
    actionOperate(action){
      action.actionLoading = true;
      let index = this.actions.findIndex(item=>item.action === action.action);
      this.$set(this.actions, index, action);
      if(action.action === "SAVE"){
        this.$emit('saveBusiness',true);
      }else if(action.action === 'SUBMIT'){
        this.$emit('saveBusiness',false,(val)=>{
          if(val){
            action.actionLoading = false;
            this.$set(this.actions, index, action);
            this.$refs.submitProcess.showDialog(this.workflowDetail,this.formData)
          }
        })
      }else if(action.action === 'ADD_ACTOR'){
        this.$refs.addActor.showDialog(this.workflowDetail);
      }else if (action.action === 'TERMINATION'){
        this.$refs.termination.showDialog(this.workflowDetail);
      }else if (action.action === 'TRANSFER'){
        this.$refs.transferActor.showDialog(this.workflowDetail);
      }else if (action.action === 'REJECT'){
        this.$refs.reject.showDialog(this.workflowDetail);
      }
    },
    refreshPage(param){
      let routeData=this.$router.resolve({ path: '/reimburse', query: param });
      window.open(routeData.href, '_self')
      location.reload();
    },
    closeNowWindow(){
      //关闭当前窗口
      window.close();
    }
  },

}
</script>


<style src="../css/index.scss" lang="scss"></style>
<style lang="scss" scoped>
.search-item{
  float: left;
  margin: 0 20px 20px 0;
  span{
    color: #606266;
    font-size: 14px;
    margin-right: 0px;
  }
}
.workProcessClass{
  height: 500px;
  overflow: auto;
  border: 1px solid #ebeef5;
  border-radius: 4px;
  background: white;
}
</style>
